<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>回顾Object.defineProperty 是如何实现响应式处理的</title>
</head>
<body>

<script>
    // 创建一个 user1 对象
    let user1 = {
        name : 'jack'
    }

    // 创建一个 user2 对象
    let user2 = {}

    // 给 user2 扩展一个属性name
    Object.defineProperty(user2,'name',{
        // 数据代理
        get(){
            console.log('get方法执行了')
            return user1.name
        },
        // 数据劫持
        set(value){
            // 改数据
            user1.name = value
            // 同时在这里可以进行响应式处理，更新页面
            console.log('这里进行响应式处理，页面已经更新')
        }
    })
</script>

</body>
</html>